<%@ page language="java" import="java.util.*"
	contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	ArrayList<String> jsPaths = (ArrayList<String>) request
			.getAttribute("jsPaths");
	jsPaths.add("/resources/bootstrap/table/jquery.dataTables.min.js");
	jsPaths.add("/resources/bootstrap/table/dataTables.bootstrap.js");
	jsPaths.add("/resources/custom/meter/meter.js");
%>
<div class="panel-group" id="accordion">
	<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title">
				<div data-toggle="collapse" data-toggle="collapse"
					data-parent="#accordion" href="#collapseOne"
					style="cursor: pointer;">
					<img alt=""
						src="${pageContext.request.contextPath}/resources/bootstrap/custom/search.png">
					&nbsp;搜索项目<span class="glyphicon glyphicon-chevron-down pull-right"
						id="arrow"></span>
				</div>
			</h4>
		</div>
		<div id="collapseOne" class="panel-collapse collapse">
			<div class="panel-body">
				<form role="form">
					<div class='row'>
						<div class="form-group col-sm-4">
							<label for="searchName" class="col-sm-4 control-label">总表名称:</label>
							<div class="col-sm-8">
								<input name="searchName" id="searchName" class="form-control"
									placeholder="总表名称">
							</div>
						</div>
						<div class="form-group col-sm-4">
							<label for="searchDeviceKey" class="col-sm-4 control-label">设备标识:</label>
							<div class="col-sm-8">
								<input name="searchDeviceKey" id="searchDeviceKey"
									class="form-control" placeholder="设备标识">
							</div>
						</div>

						<div class="form-group col-sm-4">
							<label for="searchAddr1" class="col-sm-4 control-label">一级地址:</label>
							<div class="col-sm-8">
								<input name="searchAddr1" id="searchAddr1" class="form-control"
									placeholder="一级地址">
							</div>
						</div>

					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<button class="btn btn-success btn-sm" data-toggle="modal"
	data-target="#createMeterModal" id="addMeter">添加总表</button>
<div class="table-responsive">
	<table id="meter"
		class="table table-striped table-bordered table-hover display"
		cellspacing="0" width="100%">
		<thead>
			<tr>
				<th></th>
				<th>总表名称</th>
				<th>设备标识</th>
				<th>一级地址</th>			
				<th></th>
			</tr>
		</thead>
	</table>
</div>
<!-- add meter dialog -->
<div class="modal fade" id="createMeterModal" tabindex="-1"
	role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">总表</h4>
			</div>

			<form id="addForm" class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/meter/create"
				method="post">
				<div class="modal-body">
					<div class="form-group">
						<label for="name" class="col-sm-3 control-label">总表名称</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="name" name="name"
								placeholder="总表名称">
						</div>
					</div>
					<div class="form-group">
						<label for="deviceKey" class="col-sm-3 control-label">设备标识</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="deviceKey"
								name="deviceKey" placeholder="设备标识">
						</div>
					</div>
					<div class="form-group">
						<label for="addr1" class="col-sm-3 control-label">一级地址</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="addr1" name="addr1"
								placeholder="一级地址">
						</div>
					</div>

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary" id="create">创建总表</button>
				</div>
			</form>
		</div>
	</div>
</div>
<!-- edit meter dialog -->
<div class="modal fade" id="editMeterModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">总表</h4>
			</div>

			<form id="editForm" class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/meter/update"
				method="post">
				<div class="modal-body">
					<input type="hidden" id="idEdit" name="id">
					<div class="form-group">
						<label for="nameEdit" class="col-sm-3 control-label">总表名称</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="nameEdit" name="name"
								placeholder="总表名称">
						</div>
					</div>
					<div class="form-group">
						<label for="deviceKeyEdit" class="col-sm-3 control-label">设备标识</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="deviceKeyEdit"
								name="deviceKey" placeholder="设备标识">
						</div>
					</div>
					<div class="form-group">
						<label for="addr1Edit" class="col-sm-3 control-label">一级地址</label>
						<div class="col-sm-9">
							<input type="text" class="form-control" id="addr1Edit"
								name="addr1" placeholder="一级地址">
						</div>
					</div>

				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary" id="update">更新</button>
				</div>
			</form>
		</div>
	</div>
</div>

<!-- delete meter dialog -->
<div class="modal fade" id="deleteMeterModal">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title">删除总表</h4>
			</div>
			<div class="modal-body">
				<p>确定永久删除该条记录吗？</p>
			</div>
			<form class="form-horizontal" role="form"
				action="${pageContext.request.contextPath}/meter/delete"
				method="post">
				<input type="hidden" class="form-control" id="idDelete" name="id">

				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="submit" class="btn btn-primary">删除</button>
				</div>
			</form>
		</div>
	</div>
</div>